import { gsap } from "gsap";

/**
 * 显示加载动画（全屏覆盖效果）
 * @param {HTMLElement} element - 动画元素
 */
export function showLoading(element) {
    if (element) {
        gsap.fromTo(
            element,
            { opacity: 0, scale: 0.9 },  // 初始透明度和缩放
            {
                opacity: 1,
                scale: 1,
                duration: 0.6,  // 修改动画时长为0.6秒
                ease: "power2.out",
                onStart: () => {
                    element.style.display = "flex";  // 显示加载动画
                    element.style.zIndex = 9999; // 确保它显示在最上层
                },
            }
        );
    }
}

/**
 * 隐藏加载动画
 * @param {HTMLElement} element - 动画元素
 */
export function hideLoading(element) {
    if (element) {
        gsap.to(element, {
            opacity: 0,  // 渐变透明度为0
            scale: 0.9,  // 缩小效果
            duration: 0.4,  // 动画时长为0.4秒
            ease: "power2.in",
            onComplete: () => {
                element.style.display = "none"; // 动画完成后隐藏元素
                element.style.zIndex = -1; // 确保加载动画不会遮挡其他内容
            }
        });
    }
}
